<template>
  <div>
    <div class="bread" style="height: 50px;background: 	#77DDFF">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item style="font-weight: bold;">公司后端</el-breadcrumb-item>
        <el-breadcrumb-item style="font-weight: bold;">基本信息</el-breadcrumb-item>
        <el-breadcrumb-item style="font-weight: bold;">数据统计</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="container" style="height: 100%;width: 100%">
      <div class="left-panel" style="width: 50%; border: 1px solid black;">
        <div style="width: 100%; text-align: center;"> <!-- 新增包裹的div -->
          <span style="font-size: large">岗位类别比例统计</span>
        </div>
        <company-statistics-left></company-statistics-left>
      </div>
      <div class="right-panel">
        <div class="top-panel" style="height: 50%; border: 1px solid black;">
          <company-statistics-right-up></company-statistics-right-up>
          <div style="width: 100%; text-align: center;"> <!-- 新增包裹的div -->
            <span style="font-size: large">薪资统计</span>
          </div>
        </div>
        <div class="bottom-panel" style="height: 50%; border: 1px solid black;">
          <div style="width: 100%; text-align: center;"> <!-- 新增包裹的div -->
            <span style="font-size: large">简历投递情况</span>
          </div>
          <company-statistics-right-down></company-statistics-right-down>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import CompanyStatisticsRightUp from "@/components/company/statistics/companyStatisticsRightUp.vue";
import CompanyStatisticsLeft from "@/components/company/statistics/companyStatisticsLeft.vue";
import CompanyStatisticsRightDown from "@/components/company/statistics/companyStatisticsRightDown.vue";
export default {
  name:'companyStatistics',
  components: {CompanyStatisticsRightDown, CompanyStatisticsLeft, CompanyStatisticsRightUp},

  data() {
    return {
    }
  },

}
</script>

<style scoped>
.container {
  display: flex;
  height: 100vh;
}

.left-panel {
  background-color: #f0f0f0;
}

.right-panel {
  display: flex;
  flex-direction: column;
  width: 50%;
}

.top-panel {

}

.bottom-panel {

}

</style>

